﻿<phone:PhoneApplicationPage xmlns:UI="clr-namespace:Microsoft.Advertising.Mobile.UI;assembly=Microsoft.Advertising.Mobile.UI" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:Views="clr-namespace:Studio77.PopBall.Views"
    xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
    x:Class="Studio77.PopBall.Pages.GamePage"
    SupportedOrientations="Portrait" Orientation="Portrait"
    mc:Ignorable="d"
    shell:SystemTray.IsVisible="False">
    <toolkit:TransitionService.NavigationInTransition>
        <toolkit:NavigationInTransition>
            <toolkit:NavigationInTransition.Backward>
                <toolkit:TurnstileTransition Mode="BackwardIn"/>
            </toolkit:NavigationInTransition.Backward>
            <toolkit:NavigationInTransition.Forward>
                <toolkit:TurnstileTransition Mode="ForwardIn"/>
            </toolkit:NavigationInTransition.Forward>
        </toolkit:NavigationInTransition>
    </toolkit:TransitionService.NavigationInTransition>
    <toolkit:TransitionService.NavigationOutTransition>
        <toolkit:NavigationOutTransition>
            <toolkit:NavigationOutTransition.Backward>
                <toolkit:TurnstileTransition Mode="BackwardOut"/>
            </toolkit:NavigationOutTransition.Backward>
            <toolkit:NavigationOutTransition.Forward>
                <toolkit:TurnstileTransition Mode="BackwardOut"/>
            </toolkit:NavigationOutTransition.Forward>
        </toolkit:NavigationOutTransition>
    </toolkit:TransitionService.NavigationOutTransition>
    <phone:PhoneApplicationPage.Resources>
        <Style x:Key="ButtonStyleMagic" TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ColorAnimation Duration="0" To="#FFFFE800" Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)" Storyboard.TargetName="border" d:IsOptimized="True"/>
                                            <ColorAnimation Duration="0" To="#FF8B0505" Storyboard.TargetProperty="(Border.Background).(GradientBrush.GradientStops)[2].(GradientStop.Color)" Storyboard.TargetName="border" d:IsOptimized="True"/>
                                            <ColorAnimation Duration="0" To="#FFF33F3F" Storyboard.TargetProperty="(Border.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="border" d:IsOptimized="True"/>
                                            <DoubleAnimation Duration="0" To="0.996" Storyboard.TargetProperty="(Border.Background).(GradientBrush.GradientStops)[0].(GradientStop.Offset)" Storyboard.TargetName="border" d:IsOptimized="True"/>
                                            <ColorAnimation Duration="0" To="#FF3E0000" Storyboard.TargetProperty="(Border.Background).(GradientBrush.GradientStops)[0].(GradientStop.Color)" Storyboard.TargetName="border" d:IsOptimized="True"/>
                                            <DoubleAnimation Duration="0" To="0.161" Storyboard.TargetProperty="(Border.Background).(GradientBrush.GradientStops)[2].(GradientStop.Offset)" Storyboard.TargetName="border" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="Disabled"/>
                                    <VisualState x:Name="MouseOver"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Focused"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Border x:Name="border" BorderBrush="White" BorderThickness="1" CornerRadius="10">
                                <Border.Background>
                                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                        <GradientStop Color="#FF0059C3" Offset="1"/>
                                        <GradientStop Color="#FF3F79F3"/>
                                        <GradientStop Color="#FF052A8B" Offset="0.148"/>
                                    </LinearGradientBrush>
                                </Border.Background>
                            </Border>
                            <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Storyboard x:Name="StoryboardAddScore">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="txtCurrentScore">
                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1.1">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <CubicEase EasingMode="EaseOut"/>
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
                <EasingDoubleKeyFrame KeyTime="0:0:0.3" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="txtCurrentScore">
                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1.1">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <CubicEase EasingMode="EaseOut"/>
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
                <EasingDoubleKeyFrame KeyTime="0:0:0.3" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="txtCurrentScore">
                <EasingColorKeyFrame KeyTime="0:0:0.2" Value="#FF646464"/>
                <EasingColorKeyFrame KeyTime="0:0:0.3" Value="Black"/>
            </ColorAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="txtAddScore">
                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <BackEase EasingMode="EaseOut"/>
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
                <EasingDoubleKeyFrame KeyTime="0:0:1" Value="0"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="txtAddScore">
                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1.2">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <BackEase EasingMode="EaseOut"/>
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
                <EasingDoubleKeyFrame KeyTime="0:0:1" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="txtAddScore">
                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1.2">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <BackEase EasingMode="EaseOut"/>
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
                <EasingDoubleKeyFrame KeyTime="0:0:1" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
        <Storyboard x:Name="StoryboardShowScoreComment">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="txtSelectComment">
                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1"/>
                <EasingDoubleKeyFrame KeyTime="0:0:1.2" Value="1"/>
                <EasingDoubleKeyFrame KeyTime="0:0:2.4" Value="0.5"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="txtSelectComment">
                <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="txtSelectComment">
                <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
                <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
        <Storyboard x:Name="StoryboardShowGameCanvas">
            <DoubleAnimation Duration="0:0:0.5" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="gameCanvas" d:IsOptimized="True">
                <DoubleAnimation.EasingFunction>
                    <ExponentialEase EasingMode="EaseOut"/>
                </DoubleAnimation.EasingFunction>
            </DoubleAnimation>
            <DoubleAnimation Duration="0:0:0.5" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="txtCurrentScore" d:IsOptimized="True"/>
        </Storyboard>
        <Storyboard x:Name="StoryboardHideGameCanvas">
            <DoubleAnimation Duration="0:0:0.3" To="0" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="gameCanvas" d:IsOptimized="True"/>
            <DoubleAnimation Duration="0:0:0.3" To="0" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="txtCurrentScore" d:IsOptimized="True"/>
        </Storyboard>
        <Storyboard x:Name="StoryboardGameOver">
        	<DoubleAnimation Duration="0:0:0.9" To="0" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="bdrGameOver" d:IsOptimized="True">
        		<DoubleAnimation.EasingFunction>
        			<BackEase EasingMode="EaseOut"/>
        		</DoubleAnimation.EasingFunction>
        	</DoubleAnimation>
        </Storyboard>
        <Style x:Key="ToggleButtonStyle1" TargetType="ToggleButton">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ToggleButton">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Pressed"/>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="0.5" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="image" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="MouseOver"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Focused"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="CheckStates">
                                    <VisualState x:Name="Checked">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                            <DoubleAnimation Duration="0" To="48" Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                            <DoubleAnimation Duration="0" To="48" Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill)" Storyboard.TargetName="ellipse">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Null}"/>
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Stroke)" Storyboard.TargetName="ellipse">
                                                <DiscreteObjectKeyFrame KeyTime="0">
                                                    <DiscreteObjectKeyFrame.Value>
                                                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                                            <GradientStop Color="Yellow" Offset="0"/>
                                                            <GradientStop Color="#FFAEAE00" Offset="1"/>
                                                        </LinearGradientBrush>
                                                    </DiscreteObjectKeyFrame.Value>
                                                </DiscreteObjectKeyFrame>
                                            </ObjectAnimationUsingKeyFrames>
                                            <DoubleAnimation Duration="0" To="3" Storyboard.TargetProperty="(Shape.StrokeThickness)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Unchecked">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="image" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Indeterminate"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Image x:Name="image" Source="/Images/ball1.png" Stretch="Fill" RenderTransformOrigin="0.5,0.5">
                                <Image.RenderTransform>
                                    <CompositeTransform/>
                                </Image.RenderTransform>
                            </Image>
                            <Ellipse x:Name="ellipse" Fill="#FFF4F4F5" HorizontalAlignment="Left" Height="42" Opacity="0" Stroke="Black" VerticalAlignment="Top" Width="40"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="ToggleButtonStyle2" TargetType="ToggleButton">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ToggleButton">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Pressed"/>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="0.5" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="image" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="MouseOver"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Focused"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="CheckStates">
                                    <VisualState x:Name="Checked">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                            <DoubleAnimation Duration="0" To="48" Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                            <DoubleAnimation Duration="0" To="48" Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill)" Storyboard.TargetName="ellipse">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Null}"/>
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Stroke)" Storyboard.TargetName="ellipse">
                                                <DiscreteObjectKeyFrame KeyTime="0">
                                                    <DiscreteObjectKeyFrame.Value>
                                                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                                            <GradientStop Color="Yellow" Offset="0"/>
                                                            <GradientStop Color="#FFAEAE00" Offset="1"/>
                                                        </LinearGradientBrush>
                                                    </DiscreteObjectKeyFrame.Value>
                                                </DiscreteObjectKeyFrame>
                                            </ObjectAnimationUsingKeyFrames>
                                            <DoubleAnimation Duration="0" To="3" Storyboard.TargetProperty="(Shape.StrokeThickness)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Unchecked">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="image" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Indeterminate"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Image x:Name="image" Source="/Images/ball2.png" Stretch="Fill" RenderTransformOrigin="0.5,0.5">
                                <Image.RenderTransform>
                                    <CompositeTransform/>
                                </Image.RenderTransform>
                            </Image>
                            <Ellipse x:Name="ellipse" Fill="#FFF4F4F5" HorizontalAlignment="Left" Height="42" Opacity="0" Stroke="Black" VerticalAlignment="Top" Width="40"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="ToggleButtonStyle3" TargetType="ToggleButton">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ToggleButton">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Pressed"/>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="0.5" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="image" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="MouseOver"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Focused"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="CheckStates">
                                    <VisualState x:Name="Checked">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                            <DoubleAnimation Duration="0" To="48" Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                            <DoubleAnimation Duration="0" To="48" Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill)" Storyboard.TargetName="ellipse">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Null}"/>
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Stroke)" Storyboard.TargetName="ellipse">
                                                <DiscreteObjectKeyFrame KeyTime="0">
                                                    <DiscreteObjectKeyFrame.Value>
                                                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                                            <GradientStop Color="Yellow" Offset="0"/>
                                                            <GradientStop Color="#FFAEAE00" Offset="1"/>
                                                        </LinearGradientBrush>
                                                    </DiscreteObjectKeyFrame.Value>
                                                </DiscreteObjectKeyFrame>
                                            </ObjectAnimationUsingKeyFrames>
                                            <DoubleAnimation Duration="0" To="3" Storyboard.TargetProperty="(Shape.StrokeThickness)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Unchecked">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="image" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Indeterminate"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Image x:Name="image" Source="/Images/ball3.png" Stretch="Fill" RenderTransformOrigin="0.5,0.5">
                                <Image.RenderTransform>
                                    <CompositeTransform/>
                                </Image.RenderTransform>
                            </Image>
                            <Ellipse x:Name="ellipse" Fill="#FFF4F4F5" HorizontalAlignment="Left" Height="42" Opacity="0" Stroke="Black" VerticalAlignment="Top" Width="40"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="ToggleButtonStyle4" TargetType="ToggleButton">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ToggleButton">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Pressed"/>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="0.5" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="image" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="MouseOver"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Focused"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="CheckStates">
                                    <VisualState x:Name="Checked">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                            <DoubleAnimation Duration="0" To="48" Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                            <DoubleAnimation Duration="0" To="48" Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill)" Storyboard.TargetName="ellipse">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Null}"/>
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Stroke)" Storyboard.TargetName="ellipse">
                                                <DiscreteObjectKeyFrame KeyTime="0">
                                                    <DiscreteObjectKeyFrame.Value>
                                                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                                            <GradientStop Color="Yellow" Offset="0"/>
                                                            <GradientStop Color="#FFAEAE00" Offset="1"/>
                                                        </LinearGradientBrush>
                                                    </DiscreteObjectKeyFrame.Value>
                                                </DiscreteObjectKeyFrame>
                                            </ObjectAnimationUsingKeyFrames>
                                            <DoubleAnimation Duration="0" To="3" Storyboard.TargetProperty="(Shape.StrokeThickness)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Unchecked">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="image" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Indeterminate"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Image x:Name="image" Source="/Images/ball4.png" Stretch="Fill" RenderTransformOrigin="0.5,0.5">
                                <Image.RenderTransform>
                                    <CompositeTransform/>
                                </Image.RenderTransform>
                            </Image>
                            <Ellipse x:Name="ellipse" Fill="#FFF4F4F5" HorizontalAlignment="Left" Height="42" Opacity="0" Stroke="Black" VerticalAlignment="Top" Width="40"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Storyboard x:Name="StoryboardShowPause">
            <DoubleAnimation Duration="0:0:0.8" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="bdrPause" d:IsOptimized="True">
                <DoubleAnimation.EasingFunction>
                    <CircleEase EasingMode="EaseInOut"/>
                </DoubleAnimation.EasingFunction>
            </DoubleAnimation>
        </Storyboard>
        <Storyboard x:Name="StoryboardHidePause">
            <DoubleAnimation Duration="0:0:0.7" To="0" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="bdrPause" d:IsOptimized="True">
                <DoubleAnimation.EasingFunction>
                    <CircleEase EasingMode="EaseInOut"/>
                </DoubleAnimation.EasingFunction>
            </DoubleAnimation>
        </Storyboard>
        <Style x:Key="ToggleButtonStyle5" TargetType="ToggleButton">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ToggleButton">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Pressed"/>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="0.5" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="image" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="MouseOver"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Focused"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="CheckStates">
                                    <VisualState x:Name="Checked">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                            <DoubleAnimation Duration="0" To="48" Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                            <DoubleAnimation Duration="0" To="48" Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill)" Storyboard.TargetName="ellipse">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Null}"/>
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Stroke)" Storyboard.TargetName="ellipse">
                                                <DiscreteObjectKeyFrame KeyTime="0">
                                                    <DiscreteObjectKeyFrame.Value>
                                                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                                            <GradientStop Color="Yellow" Offset="0"/>
                                                            <GradientStop Color="#FFAEAE00" Offset="1"/>
                                                        </LinearGradientBrush>
                                                    </DiscreteObjectKeyFrame.Value>
                                                </DiscreteObjectKeyFrame>
                                            </ObjectAnimationUsingKeyFrames>
                                            <DoubleAnimation Duration="0" To="3" Storyboard.TargetProperty="(Shape.StrokeThickness)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Unchecked">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="image" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Indeterminate"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Image x:Name="image" Source="/Images/ball5.png" Stretch="Fill" RenderTransformOrigin="0.5,0.5">
                                <Image.RenderTransform>
                                    <CompositeTransform/>
                                </Image.RenderTransform>
                            </Image>
                            <Ellipse x:Name="ellipse" Fill="#FFF4F4F5" HorizontalAlignment="Left" Height="42" Opacity="0" Stroke="Black" VerticalAlignment="Top" Width="40"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="ButtonStyleClose" TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill)" Storyboard.TargetName="ellipse">
                                                <DiscreteObjectKeyFrame KeyTime="0">
                                                    <DiscreteObjectKeyFrame.Value>
                                                        <SolidColorBrush Color="#FF0051FF"/>
                                                    </DiscreteObjectKeyFrame.Value>
                                                </DiscreteObjectKeyFrame>
                                            </ObjectAnimationUsingKeyFrames>
                                            <ColorAnimation Duration="0" To="#FFFFF300" Storyboard.TargetProperty="(Shape.Stroke).(SolidColorBrush.Color)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
                                            <ColorAnimation Duration="0" To="#FFFFF300" Storyboard.TargetProperty="(Shape.Stroke).(SolidColorBrush.Color)" Storyboard.TargetName="path" d:IsOptimized="True"/>
                                            <ColorAnimation Duration="0" To="#FFFFF300" Storyboard.TargetProperty="(Shape.Stroke).(SolidColorBrush.Color)" Storyboard.TargetName="path1" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="Disabled"/>
                                    <VisualState x:Name="MouseOver"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Focused"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Ellipse x:Name="ellipse" Stroke="White" StrokeThickness="2">
                                <Ellipse.Fill>
                                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                        <GradientStop Color="#FFFF6262" Offset="0"/>
                                        <GradientStop Color="#FF800202" Offset="1"/>
                                        <GradientStop Color="#FFAC0909" Offset="0.23"/>
                                    </LinearGradientBrush>
                                </Ellipse.Fill>
                            </Ellipse>
                            <Path x:Name="path" Data="M10,10 L24,24" HorizontalAlignment="Left" Height="16" Margin="9,9,0,0" Stretch="Fill" Stroke="White" StrokeThickness="4" UseLayoutRounding="False" VerticalAlignment="Top" Width="16">
                                <Path.Fill>
                                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                        <GradientStop Color="#FFFF6262" Offset="0"/>
                                        <GradientStop Color="#FF800202" Offset="1"/>
                                        <GradientStop Color="#FFAC0909" Offset="0.23"/>
                                    </LinearGradientBrush>
                                </Path.Fill>
                            </Path>
                            <Path x:Name="path1" Data="M10,10 L24,24" HorizontalAlignment="Left" Height="16" Margin="9,9,0,0" Stretch="Fill" Stroke="White" StrokeThickness="4" UseLayoutRounding="False" VerticalAlignment="Top" Width="16" RenderTransformOrigin="0.5,0.5">
                                <Path.RenderTransform>
                                    <CompositeTransform Rotation="90"/>
                                </Path.RenderTransform>
                                <Path.Fill>
                                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                        <GradientStop Color="#FFFF6262" Offset="0"/>
                                        <GradientStop Color="#FF800202" Offset="1"/>
                                        <GradientStop Color="#FFAC0909" Offset="0.23"/>
                                    </LinearGradientBrush>
                                </Path.Fill>
                            </Path>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Storyboard x:Name="StoryboardShowMagicBall"/>
        <Storyboard x:Name="StoryboardHideMagicBall"/>
        <Storyboard x:Name="StoryboardAddMagicBall"/>
        <Style x:Key="ButtonStyleSoundOff" TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid Background="#02FFFFFF">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="Disabled"/>
                                    <VisualState x:Name="MouseOver"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Focused"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Image Source="/Images/sound_on.png" Stretch="Fill"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="ButtonStyleSoundOn" TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid Background="#02FFFFFF">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="Disabled"/>
                                    <VisualState x:Name="MouseOver"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Focused"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Image Source="/Images/sound_off.png" Stretch="Fill"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="ButtonStyleHome" TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="1.1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="image" d:IsOptimized="True"/>
                                            <DoubleAnimation Duration="0" To="1.1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="image" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="Disabled"/>
                                    <VisualState x:Name="MouseOver"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Focused"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Image x:Name="image" Source="/Studio77.PopBall;component/Images/btn_home.png" Stretch="Fill" RenderTransformOrigin="0.5,0.5">
                                <Image.RenderTransform>
                                    <CompositeTransform/>
                                </Image.RenderTransform>
                            </Image>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="ButtonStyle1" TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="53*"/>
                                <ColumnDefinition Width="194*"/>
                            </Grid.ColumnDefinitions>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ColorAnimation Duration="0" To="#FFFFDFA6" Storyboard.TargetProperty="(Border.Background).(GradientBrush.GradientStops)[2].(GradientStop.Color)" Storyboard.TargetName="border" d:IsOptimized="True"/>
                                            <ColorAnimation Duration="0" To="#FFFF8B00" Storyboard.TargetProperty="(Border.Background).(GradientBrush.GradientStops)[0].(GradientStop.Color)" Storyboard.TargetName="border" d:IsOptimized="True"/>
                                            <ColorAnimation Duration="0" To="#FF442A04" Storyboard.TargetProperty="(Border.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="border" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="0.3" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="contentPresenter" d:IsOptimized="True"/>
                                            <DoubleAnimation Duration="0" To="0.3" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="image" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="MouseOver"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Focused"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Border x:Name="border" BorderBrush="White" BorderThickness="1" CornerRadius="10" Grid.ColumnSpan="2">
                                <Border.Background>
                                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                        <GradientStop Color="#FF68FF00" Offset="0.07"/>
                                        <GradientStop Color="#FF044421" Offset="1"/>
                                        <GradientStop Color="#FFDCFFDD"/>
                                    </LinearGradientBrush>
                                </Border.Background>
                            </Border>
                            <ContentPresenter x:Name="contentPresenter" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Grid.Column="1"/>
                            <Image x:Name="image" Margin="10,9,6.667,8" Source="/Images/colorball.png" Stretch="Fill"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="ButtonStyle3" TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="53*"/>
                                <ColumnDefinition Width="194*"/>
                            </Grid.ColumnDefinitions>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ColorAnimation Duration="0" To="#FFFFDFA6" Storyboard.TargetProperty="(Border.Background).(GradientBrush.GradientStops)[2].(GradientStop.Color)" Storyboard.TargetName="border" d:IsOptimized="True"/>
                                            <ColorAnimation Duration="0" To="#FFFF8B00" Storyboard.TargetProperty="(Border.Background).(GradientBrush.GradientStops)[0].(GradientStop.Color)" Storyboard.TargetName="border" d:IsOptimized="True"/>
                                            <ColorAnimation Duration="0" To="#FF442A04" Storyboard.TargetProperty="(Border.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="border" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" To="0.3" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="contentPresenter" d:IsOptimized="True"/>
                                            <DoubleAnimation Duration="0" To="0.3" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="image" d:IsOptimized="True"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="MouseOver"/>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Focused"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Border x:Name="border" BorderBrush="White" BorderThickness="1" CornerRadius="10" Grid.ColumnSpan="2">
                                <Border.Background>
                                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                        <GradientStop Color="Red" Offset="0.07"/>
                                        <GradientStop Color="#FF440404" Offset="1"/>
                                        <GradientStop Color="#FFFF8585"/>
                                    </LinearGradientBrush>
                                </Border.Background>
                            </Border>
                            <ContentPresenter x:Name="contentPresenter" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Grid.Column="1"/>
                            <Image x:Name="image" Margin="10,9,6.667,8" Source="/Images/colorball.png" Stretch="Fill"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="ProgressBarStyle1" TargetType="ProgressBar">
            <Setter Property="Foreground" Value="{StaticResource PhoneAccentBrush}"/>
            <Setter Property="Background" Value="{StaticResource PhoneProgressBarBackgroundBrush}"/>
            <Setter Property="Maximum" Value="100"/>
            <Setter Property="IsHitTestVisible" Value="False"/>
            <Setter Property="Padding" Value="{StaticResource PhoneHorizontalMargin}"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ProgressBar">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Determinate"/>
                                    <VisualState x:Name="Indeterminate">
                                        <Storyboard Duration="00:00:00" RepeatBehavior="Forever">
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="IndeterminateRoot">
                                                <DiscreteObjectKeyFrame KeyTime="0">
                                                    <DiscreteObjectKeyFrame.Value>
                                                        <Visibility>Visible</Visibility>
                                                    </DiscreteObjectKeyFrame.Value>
                                                </DiscreteObjectKeyFrame>
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="DeterminateRoot">
                                                <DiscreteObjectKeyFrame KeyTime="0">
                                                    <DiscreteObjectKeyFrame.Value>
                                                        <Visibility>Collapsed</Visibility>
                                                    </DiscreteObjectKeyFrame.Value>
                                                </DiscreteObjectKeyFrame>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Grid x:Name="DeterminateRoot" Visibility="Visible">
                                <Rectangle x:Name="ProgressBarTrack" Fill="{TemplateBinding Background}"/>
                                <Rectangle x:Name="ProgressBarIndicator" Fill="{TemplateBinding Foreground}" HorizontalAlignment="Left"/>
                            </Grid>
                            <Border x:Name="IndeterminateRoot" Margin="{TemplateBinding Padding}" Visibility="Collapsed">
                                <Grid x:Name="SliderContainer" IsHitTestVisible="False">
                                    <Rectangle x:Name="Slider0" CacheMode="BitmapCache" Fill="{TemplateBinding Foreground}" HorizontalAlignment="Left" Height="4" Width="4"/>
                                    <Rectangle x:Name="Slider1" CacheMode="BitmapCache" Fill="{TemplateBinding Foreground}" HorizontalAlignment="Left" Height="4" Width="4"/>
                                    <Rectangle x:Name="Slider2" CacheMode="BitmapCache" Fill="{TemplateBinding Foreground}" HorizontalAlignment="Left" Height="4" Width="4"/>
                                    <Rectangle x:Name="Slider3" CacheMode="BitmapCache" Fill="{TemplateBinding Foreground}" HorizontalAlignment="Left" Height="4" Width="4"/>
                                    <Rectangle x:Name="Slider4" CacheMode="BitmapCache" Fill="{TemplateBinding Foreground}" HorizontalAlignment="Left" Height="4" Width="4"/>
                                </Grid>
                            </Border>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="ButtonStyleContinue" TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill)" Storyboard.TargetName="ellipse">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource BrushMainPageTitle}"/>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="Disabled">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill)" Storyboard.TargetName="ellipse">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource BrushMainPageTitle}"/>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="MouseOver"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Ellipse x:Name="ellipse" Width="147" VerticalAlignment="Top" StrokeThickness="0" Stroke="Black" Height="147" HorizontalAlignment="Center" Fill="#FF00CF00"/>
                            <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="ButtonStyleNewGame" TargetType="Button">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Pressed">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill)" Storyboard.TargetName="ellipse">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource BrushMainPageTitle}"/>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="Disabled"/>
                                    <VisualState x:Name="MouseOver"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Ellipse x:Name="ellipse" Width="147" VerticalAlignment="Top" StrokeThickness="0" Stroke="Black" Height="147" HorizontalAlignment="Center" Fill="#FFEA0000"/>
                            <TextBlock HorizontalAlignment="Center" TextWrapping="Wrap" VerticalAlignment="Center" TextAlignment="Center" FontSize="22.667" Text="MAIN PAGE"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Storyboard x:Name="StoryboardStageClear">
            <DoubleAnimation Duration="0:0:0.7" To="0" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="stackClearFlag" d:IsOptimized="True">
                <DoubleAnimation.EasingFunction>
                    <BounceEase Bounciness="8" Bounces="2" EasingMode="EaseOut"/>
                </DoubleAnimation.EasingFunction>
            </DoubleAnimation>
        </Storyboard>
        <Storyboard x:Name="StoryboardHideStageClear">
            <DoubleAnimation Duration="0:0:0.2" To="130" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="stackClearFlag" d:IsOptimized="True"/>
        </Storyboard>
        <Storyboard x:Name="StoryboardShowAddDesc">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="stackAddScoreFlag">
                <EasingDoubleKeyFrame KeyTime="0:0:0.4" Value="0">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <BackEase EasingMode="EaseOut"/>
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
                <EasingDoubleKeyFrame KeyTime="0:0:0.7" Value="130">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <CircleEase EasingMode="EaseIn"/>
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
        <Style x:Key="ButtonStyleGameover" TargetType="Button">
        	<Setter Property="Template">
        		<Setter.Value>
        			<ControlTemplate TargetType="Button">
        				<Grid>
        					<VisualStateManager.VisualStateGroups>
        						<VisualStateGroup x:Name="CommonStates">
        							<VisualState x:Name="Pressed">
        								<Storyboard>
        									<ColorAnimation Duration="0" To="#FF515151" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="ellipse" d:IsOptimized="True"/>
        								</Storyboard>
        							</VisualState>
        							<VisualState x:Name="Normal"/>
        							<VisualState x:Name="Disabled"/>
        							<VisualState x:Name="MouseOver"/>
        						</VisualStateGroup>
        					</VisualStateManager.VisualStateGroups>
        					<Ellipse x:Name="ellipse" Fill="#FF00A804" Stroke="Black" StrokeThickness="0"/>
        					<ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
        				</Grid>
        			</ControlTemplate>
        		</Setter.Value>
        	</Setter>
        </Style>
    </phone:PhoneApplicationPage.Resources>

    <phone:PhoneApplicationPage.FontFamily>
        <StaticResource ResourceKey="PhoneFontFamilyNormal"/>
    </phone:PhoneApplicationPage.FontFamily>
    <phone:PhoneApplicationPage.FontSize>
        <StaticResource ResourceKey="PhoneFontSizeNormal"/>
    </phone:PhoneApplicationPage.FontSize>
    <phone:PhoneApplicationPage.Foreground>
        <StaticResource ResourceKey="PhoneForegroundBrush"/>
    </phone:PhoneApplicationPage.Foreground>

    <!--LayoutRoot 是包含所有页面内容的根网格-->
    <Viewbox>
        <Grid x:Name="LayoutRoot" Background="{StaticResource BrushBackground}" Height="800" Width="480">
            <Grid.RowDefinitions>
                <RowDefinition Height="65"/>
                <RowDefinition/>
                <RowDefinition Height="80"/>
            </Grid.RowDefinitions>

            <Views:GameCanvas x:Name="gameCanvas" HorizontalAlignment="Center" Height="460" VerticalAlignment="Bottom" Width="460" Background="#02FFFFFF" Grid.Row="1" RenderTransformOrigin="0.5,0.5" Margin="0,0,0,30" Opacity="0">
                <Views:GameCanvas.RenderTransform>
                    <CompositeTransform/>
                </Views:GameCanvas.RenderTransform>
            </Views:GameCanvas>
            <Grid x:Name="gridTop">
                <Border Background="#FFB4B4B4"/>
                <Button x:Name="btnSoundOff" Click="btnSoundOff_Click" Content="Button" Margin="433,13,8,14" Style="{StaticResource ButtonStyleSoundOff}"/>
                <Button x:Name="btnSoundOn" Click="btnSoundOn_Click" Content="Button" Margin="433,13,8,14" Style="{StaticResource ButtonStyleSoundOn}"/>
                <Grid HorizontalAlignment="Left" Height="36" VerticalAlignment="Top" Width="129" Background="{StaticResource BrushBackground}" Margin="7,15,0,0">
                    <TextBlock x:Name="txtStage" HorizontalAlignment="Right" TextWrapping="Wrap" Text="1" VerticalAlignment="Center" Foreground="Black" FontSize="24" FontFamily="Segoe WP Semibold" Margin="0,2,8,2"/>
                    <TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="STAGE" VerticalAlignment="Center" Foreground="Black" FontSize="24" FontFamily="Segoe WP Semibold" Margin="8,0,0,0" FontWeight="Bold"/>
                </Grid>
                <Grid HorizontalAlignment="Left" Height="36" VerticalAlignment="Top" Width="273" Background="{StaticResource BrushBackground}" Margin="147,15,0,0">
                    <TextBlock x:Name="txtTarget" HorizontalAlignment="Right" TextWrapping="Wrap" Text="0" VerticalAlignment="Center" Foreground="Black" FontSize="24" FontFamily="Segoe WP Semibold" Margin="0,2,7,2"/>
                    <TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="TARGET" VerticalAlignment="Center" Foreground="Black" FontSize="24" FontFamily="Segoe WP Semibold" Margin="8,0,0,0" FontWeight="Bold"/>
                </Grid>
            </Grid>

            <Views:StageStartView x:Name="startView" Grid.Row="1" HorizontalAlignment="Left" VerticalAlignment="Top" Width="480" Height="200" Margin="0,200,0,0" IsHitTestVisible="False" />
            <Image x:Name="image" Margin="51,131,50,334" Grid.Row="1" Source="/Images/gameover.png" Stretch="Fill" RenderTransformOrigin="0.5,0.5">
                <Image.RenderTransform>
                    <CompositeTransform TranslateX="480"/>
                </Image.RenderTransform>
            </Image>
            <Border HorizontalAlignment="Left" Height="80" Grid.Row="2" VerticalAlignment="Bottom" Width="480" Background="#FFB4B4B4">
            	<Grid>
            		<Image x:Name="imgRuneMaster" Source="/Images/runemaster.png" Stretch="Fill" MouseLeftButtonDown="imgRuneMaster_MouseLeftButtonDown"/>
            		<TextBlock TextWrapping="Wrap" Text="Click to get this game for free" HorizontalAlignment="Right" VerticalAlignment="Bottom" Foreground="Black" FontSize="16" IsHitTestVisible="False"/>
            		<UI:AdControl x:Name="adControl" AdRefreshed="adControl_AdRefreshed" ErrorOccurred="adControl_ErrorOccurred" ApplicationId="ce763d75-16eb-417e-b00c-aa1b21ab1aa5" AdUnitId="210068" HorizontalAlignment="Left" Height="80" VerticalAlignment="Top" Width="480" Margin="0"/>
            	</Grid>
            </Border>
            <Grid Margin="0,40,0,0" Grid.Row="1" HorizontalAlignment="Center" VerticalAlignment="Top">
                <TextBlock x:Name="txtCurrentScore" HorizontalAlignment="Center" TextWrapping="Wrap" Text="0" VerticalAlignment="Top" FontSize="50.667" FontFamily="Segoe WP Semibold" RenderTransformOrigin="0.5,0.5" Foreground="Black" FontWeight="Bold" Opacity="0">
                    <TextBlock.RenderTransform>
                        <CompositeTransform TranslateY="-2"/>
                    </TextBlock.RenderTransform>
                </TextBlock>
            </Grid>
            <TextBlock x:Name="txtSelectComment" HorizontalAlignment="Center" Margin="0,100,0,0" TextWrapping="Wrap" Text="3  BALLS  45  POINTS" VerticalAlignment="Top" RenderTransformOrigin="0.5,0.5" Foreground="{StaticResource BrushMainPageTitle}" Grid.Row="1" Opacity="0">
                <TextBlock.RenderTransform>
                    <CompositeTransform/>
                </TextBlock.RenderTransform>
            </TextBlock>
            <TextBlock x:Name="txtAddScore" HorizontalAlignment="Center" Margin="0,100,0,0" TextWrapping="Wrap" VerticalAlignment="Top" RenderTransformOrigin="0.5,0.5" Foreground="{StaticResource BrushMainPageTitle}" Grid.Row="1" Text="+777" Opacity="0">
                <TextBlock.RenderTransform>
                    <CompositeTransform/>
                </TextBlock.RenderTransform>
            </TextBlock>
            <ProgressBar x:Name="progressComplete" HorizontalAlignment="Left" Height="5" Grid.Row="1" VerticalAlignment="Top" Width="480" Foreground="#FFEA0000" Value="80" Style="{StaticResource ProgressBarStyle1}"/>
            <Border x:Name="bdrPause" BorderThickness="1" HorizontalAlignment="Left" Height="650" VerticalAlignment="Top" Width="480" RenderTransformOrigin="0.5,0.5" Grid.Row="1" Background="{StaticResource BrushBackground}" Margin="0,5,0,0" Opacity="0" Visibility="Collapsed">
                <Border.RenderTransform>
                    <CompositeTransform/>
                </Border.RenderTransform>
                <Grid HorizontalAlignment="Left" Height="720" Margin="0,0,-2,-2" VerticalAlignment="Top" Width="480">
                    <Button Click="btnResume_Click" x:Name="btnResume" Content="RESUME" Style="{StaticResource ButtonStyleContinue}" Margin="0,163,0,410" HorizontalAlignment="Center"/>
                    <Button x:Name="btnMainPage" Content="Button" Click="btnMainMenu_Click" HorizontalAlignment="Center" Margin="0,338,0,0" Style="{StaticResource ButtonStyleNewGame}" VerticalAlignment="Top"/>
                    <TextBlock HorizontalAlignment="Center" Margin="0,507,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Foreground="{StaticResource BrushMainPageTitle}" Text="The record wiil be saved automatically."/>
                </Grid>
            </Border>
            <StackPanel x:Name="stackClearFlag" HorizontalAlignment="Right" Height="32" Margin="0,10,10,0" Grid.Row="1" VerticalAlignment="Top" Orientation="Horizontal" IsHitTestVisible="False" RenderTransformOrigin="0.5,0.5">
                <StackPanel.RenderTransform>
                    <CompositeTransform TranslateX="130"/>
                </StackPanel.RenderTransform>
                <Ellipse Fill="#FFEA0000" HorizontalAlignment="Left" Height="12" Margin="0" StrokeThickness="0" Width="12" VerticalAlignment="Center" IsHitTestVisible="False"/>
                <TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="StageClear" Foreground="#FFEA0000" Margin="5,0,0,0" IsHitTestVisible="False"/>
            </StackPanel>
            <StackPanel x:Name="stackAddScoreFlag" HorizontalAlignment="Right" Height="32" Margin="0,50,10,0" Grid.Row="1" VerticalAlignment="Top" Orientation="Horizontal" IsHitTestVisible="False" RenderTransformOrigin="0.5,0.5">
                <StackPanel.RenderTransform>
                    <CompositeTransform TranslateX="130"/>
                </StackPanel.RenderTransform>
                <Ellipse Fill="#FF00A804" HorizontalAlignment="Left" Height="12" Margin="0" StrokeThickness="0" Width="12" VerticalAlignment="Center" IsHitTestVisible="False"/>
                <TextBlock x:Name="txtAddScoreComment" HorizontalAlignment="Left" TextWrapping="Wrap" Text="Good Job" Foreground="#FF00A804" Margin="5,0,0,0" IsHitTestVisible="False"/>
            </StackPanel>
            <Border x:Name="bdrGameOver" BorderBrush="Black" HorizontalAlignment="Left" Height="650" Margin="0,5,0,0" Grid.Row="1" VerticalAlignment="Top" Width="480" Background="#FFF9F9F9" RenderTransformOrigin="0.5,0.5">
            	<Border.RenderTransform>
            		<CompositeTransform TranslateX="480"/>
            	</Border.RenderTransform>
            	<Border BorderBrush="Black" HorizontalAlignment="Center" Height="263" VerticalAlignment="Top" Width="300" Margin="0,176,0,0" Background="#FFB4B4B4">
            		<Grid>
            			<TextBlock HorizontalAlignment="Center" Margin="0,10,0,0" TextWrapping="Wrap" Text="GAME OVER" VerticalAlignment="Top" Foreground="Black" FontSize="32" FontWeight="Bold"/>
            			<Border HorizontalAlignment="Center" Height="47" Margin="0,75,0,0" VerticalAlignment="Top" Width="270" Background="#FFF9F9F9">
            				<TextBlock x:Name="txtGameOverScore" HorizontalAlignment="Center" TextWrapping="Wrap" VerticalAlignment="Center" Foreground="Black" FontSize="26.667"/>
            			</Border>
                        <Button Content="OK" Click="GameOverOk_Click" HorizontalAlignment="Center" Height="77" Margin="0,163,0,0" Style="{StaticResource ButtonStyleGameover}" VerticalAlignment="Top" Width="77" Foreground="#FFF9F9F9"/>
            		</Grid>
            	</Border>
            </Border>

        </Grid>

    </Viewbox>

</phone:PhoneApplicationPage>